<template>
  <div class="app-container">
    <div class="designer" style="height: 100%">
      <div v-show="!showDesigner">
        <!-- 表单管理 -->
        <div style="marginBottom: 20px">
          <el-input v-model="searchText" placeholder="请输入名称" size="small" style="width: 200px">
          </el-input>
          <el-button style="marginLeft: 10px" type="primary" size="small" @click="searchChange">搜索</el-button>
          <el-button style="marginLeft: 10px" size="small" @click="resetSearch">重置</el-button>
          <div style="float: right">
            <el-button type="primary" icon="el-icon-plus" size="small" @click="addPortal">新增</el-button>
            <el-button size="small" @click="multiDelPortal" :disabled="multipleSelection.length===0">批量删除</el-button>
            <el-tooltip class="item" effect="dark" content="显隐" placement="top">
              <el-button icon="el-icon-s-operation" circle @click="drawer=true"></el-button>
            </el-tooltip>
          </div>
        </div>
        <el-table ref="multipleTable" :data="tableData" stripe style="width: 100%; marginBottom: 20px" size="small"
          @selection-change="handleSelectionChange" v-loading="tableLoading" class="tableInfo" :row-key="getRowKeys"
          row-key="id">
          <el-table-column type="selection" width="80" align="center" :reserve-selection="true">
          </el-table-column>
          <el-table-column label="序号" width="80" align="center" v-if="!showHideData[0].hide" show-overflow-tooltip>
            <template slot-scope="scope">
              <span>{{
                scope.$index + (page.pageNo - 1) * page.pageSize + 1
              }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="portalName" label="名称" align="center" v-if="!showHideData[1].hide" show-overflow-tooltip>
          </el-table-column>
          <el-table-column prop="appid" label="appid" align="center" v-if="!showHideData[2].hide" show-overflow-tooltip>
          </el-table-column>
          <el-table-column prop="ascription" label="所属客户" align="center" v-if="!showHideData[3].hide" show-overflow-tooltip>
          </el-table-column>
          <el-table-column prop="createTime" label="创建时间" align="center" v-if="!showHideData[4].hide" show-overflow-tooltip>
            <template slot-scope="scope">{{
              getDateTime(scope.row.createTime)
            }}</template>
          </el-table-column>
          <el-table-column prop="createTime" label="发布时间" align="center" v-if="!showHideData[5].hide" show-overflow-tooltip>
            <template slot-scope="scope">{{
              getDateTime(scope.row.createTime)
            }}</template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="260">
            <template slot-scope="scope">
              <el-button size="small" type="text" @click="publishPortal(scope.row)">发布</el-button>
              <el-button size="small" type="text" @click="previewPortal(scope.row)">预览</el-button>
              <el-button size="small" type="text" @click="editPortal(scope.row)">编辑</el-button>
              <!-- <el-button size="small" type="text" @click="previewPortal(scope.row)">历史版本</el-button> -->
              <el-button size="small" type="text" style="color: red" @click="delPortal(scope.row)">删除
              </el-button>
              <el-button size="small" type="text" @click="showHistroy(scope.row)">历史版本</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination background :layout="layout" :total="pageTotal" :page-size="page.pageSize" :page-sizes="pageSizes"
          :current-page="page.pageNo" style="float: right" @size-change="sizeChange" @current-change="currentChange">
        </el-pagination>
      </div>
      <!-- 新增--表单发布 -->
      <div v-show="showDesigner">
        <!-- 表单发布顶部 -->
        <el-row :gutter="24" style="border-bottom:1px solid rgba(168, 167, 167, 0.3);padding:0 0 10px 0">
          <el-col :span="18">
            <div class="designHeader">
              <div class="designStep">
                <div v-for="(item, index) in steps" :key="index" class="designStepItem">
                  <div class="designStepLine" :style="{border:index > 0? '1px solid rgba(0,0,0,0.3)' : '1px solid white'}"></div>
                  <div class="designStepIndex" :style="{background:index < stepNum ? '#409EFF' : 'rgba(0,0,0,0.3)'}">
                    {{ index + 1 }}
                  </div>
                  <div class="designStepTitle">{{ item }}</div>
                </div>
              </div>
            </div>
          </el-col>
          <el-col :span="6" style="textAlign: right">
            <el-button v-show="stepNum > 1" @click="nextStep('sub')">上一步</el-button>
            <el-button type="primary" v-show="stepNum <3" @click="nextStep('plus')">下一步</el-button>
            <el-button v-show="stepNum === 3" type="primary" @click="finishPortal">完成</el-button>
            <el-button type="danger" plain @click="closeDesign">关闭</el-button>
  
          </el-col>
        </el-row>
        <!-- 步骤1---基础信息 -->
        <div v-show="stepNum === 1" class="base">
          <el-form :model="portalInfo.basic" ref="basicForm" label-width="120px" class="demo-ruleForm">
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="名称:" prop="portalName" :rules="[
                    {
                      required: true,
                      message: '请输入名称',
                      trigger: 'blur',
                    }
                  ]">
                  <el-input v-model="portalInfo.basic.portalName" placeholder="请输入名称"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="appid:" prop="portalNumber" :rules="[
                    {
                      required: true,
                      message: '请输入appId',
                      trigger: 'blur',
                    }
                  ]" class="formnum">
                  <el-input v-model="portalInfo.basic.portalNumber" placeholder="请输入appId" :disabled="Boolean(portalInfo.id)">
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item label="归属客户:" prop="ascription">
                  <el-input v-model="portalInfo.basic.ascription" placeholder="请输入归属客户" :disabled="Boolean(portalInfo.id)"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="描述:" prop="portalDesc">
              <el-input type="textarea" v-model="portalInfo.basic.portalDesc" :rows="5" maxlength="200" show-word-limit
                placeholder="请输入功能描述">
              </el-input>
            </el-form-item>
          </el-form>
        </div>
        <!-- 步骤2---查询配置 -->
        <div v-show="stepNum === 2">
          <login-form ref="loginForm" ></login-form>
        </div>
         <!-- 步骤3---查询配置 -->
        <div v-show="stepNum === 3">
          <form-editor ref="design">
          </form-editor>
        </div>
      </div>
      <!-- <el-dialog visible="true"></el-dialog> -->
      <!-- 门户预览 -->
      <el-dialog :visible.sync="dialogPreviewVisible" fullscreen append-to-body>
        <!-- <parser :formConf="this.formConf" v-if="dialogPreviewVisible"></parser> -->
       <div style="display:flex;justifyContent:center;width:100%;">
     <mobile-draw :pageListAll="{pageList:mobileConfData.pageList,navList:mobileConfData.navList,loginForm: mobileConfData.loginForm}" ref="drawItem" :isShowLogin="true" v-if="dialogPreviewVisible"></mobile-draw> 
    </div>
      </el-dialog>
      <!-- 列显隐 -->
      <el-drawer :visible.sync="drawer" direction="rtl">
        <span slot="title" style="fontSize:18px;font-weight:500;color: #262626;">列显隐</span>
        <el-table :data="showHideData" size="small" border style="width:80%;marginLeft:10%;">
          <el-table-column prop="columnName" label="列名" align="center">
          </el-table-column>
          <el-table-column prop="hide" label="隐藏" align="center">
            <template slot-scope="scope">
              <el-checkbox v-model="scope.row.hide"></el-checkbox>
            </template>
          </el-table-column>
        </el-table>
      </el-drawer>
    </div>
    <el-dialog title="历史记录" :visible.sync="showHistroyDialg" @close="closeHistroy">
    <div class="histroy-top">
      <div class="histroy-info">
        <el-button type="primary" @click="previewHand">预览</el-button>
        <el-button type="primary" @click="setCurVersion">设为当前版本</el-button>
      </div>
      <div class="histroy-info">
        <!-- <el-button icon="el-icon-refresh" circle @click="refreshHistroy" title="刷新"></el-button> -->
        <!-- <el-button icon="el-icon-s-operation" circle></el-button> -->
      </div>
    </div>
  <el-table :data="gridData" highlight-current-row @current-change="handleCurrentHistroy">
    <el-table-column
      type="index"
      width="50">
    </el-table-column>
    <el-table-column property="portalName" label="名称" align="center" show-overflow-tooltip></el-table-column>
    <el-table-column property="version" label="版本号" align="center" show-overflow-tooltip></el-table-column>
  
    <el-table-column prop="createTime" label="创建时间" align="center" show-overflow-tooltip>
            <template slot-scope="scope">{{
              getDateTime(scope.row.createTime)
            }}</template>
          </el-table-column>
  </el-table>
  <div style="display:flex;justify-content:center;margin-top:15px;">
    <el-pagination
      @size-change="histroySizeChange"
      @current-change="histroyCurrentChange"
      :current-page="histroyPage.pageNo"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="histroyPage.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="histroyPage.total">
    </el-pagination>
  </div>
</el-dialog>
  </div>
</template>
<script>
  import { reorganizationParam } from '@/utils/index'
  import FormEditor from './components/formEditor';
  import LoginForm from './components/loginForm'
  // import PortalEditor from './components/portalEditor';
  import parser from './components/parser'
  import Sortable from "sortablejs";
  import {
    menuRelease,
    menuUpdate
  } from "@/api/custom/formPoster";
  import {
    getPagePortal,
    addPortal,
    delPortal,
    editPortal,
    batchDelPortal,
    getAppIdData
  } from "@/api/custom/portalDesigner"
  // import {
  //   getRouters
  // } from "@/api/menu";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  import IconSelect from "@/components/IconSelect";
   import {basicComponents, pageOptions } from './components/mobileConfig'
   import {
  exportDefault, beautifierConf, isNumberStr, titleCase, deepClone, isObjectObject
} from '@/utils/index'
import mobileDraw from '@/views/custom/mobiledesign/components/mobileDraw.vue'
import {createHistroy,getHistroy} from '@/api/mobile/index.js';
import {Message} from 'element-ui'
  export default {
    components: {
      LoginForm,
      Treeselect,
      IconSelect,
      FormEditor,
      // PortalEditor,
      parser,
      mobileDraw
    },
    data() {
      return {
        searchFormData: {},
        stepNum: 1, //发布步骤
        steps: ["基础信息", "登录设计","页面设计"], //步骤名称
        //列显隐
        showHideData: [{
            columnName: '序号',
            hide: false
          },
          {
            columnName: '名称',
            hide: false
          },
          {
            columnName: 'appid',
            hide: false
          },
          {
            columnName: '所属客户',
            hide: false
          },
          {
            columnName: '创建时间',
            hide: false
          },
          {
            columnName: '发布时间',
            hide: false
          }
        ],
        drawer: false, //列显隐抽屉
        showDesigner: false, //显示表单设计
        tableLoading: false, //表格加载
        menuId: "",
        searchText: "", //关键字搜索
        layout: "prev, pager, next,sizes,jumper", //分页显示布局
        pageSizes: [10, 20, 30, 50], //分页显示每页条数选择
        pageTotal: 3,
        page: {
          pageNo: 1, // 当前页数
          pageSize: 10, // 每页显示多少条
        },
        //上级功能
        superior: [],
        //菜单发布数据
        portalInfo: {
          id: "",
          basic: {
            portalNumber: '',  //appid
            portalName: "", //菜单名称
            superior: 0, //父id
            sort: "", //排序
            icon: "", //图标
            portalDesc: "", //描述
            ascription:"",//归属客户

          } //基础信息
        },
        //首页表单数据
        tableData: [],
        multipleSelection: [], //多选
        dialogPreviewVisible: false,
        mobileConfData: [],
        originData: {}, //解析默认填充数据
        portalNumber: '',
        portalName: '',
        ascription:'',
        isCopy: false,
        tableName: '', //当前编辑表单数据库表名
        isReference:'', // 当前小程序是否发布
        showHistroyDialg:false,
        histroyPage:{
          pageNo:1,
          pageSize:10,
          total:0
        },
        gridData:[],
        curval:null,
        histroyid:'',
        histroykehu:'',
        editObj:null
      };
    },
    mounted() {
      // 阻止默认行为
      document.body.ondrop = function (event) {
        event.preventDefault();
        event.stopPropagation();
      };
      this.getList();
      this.tableLoading = true
    },
    watch:{
      dialogPreviewVisible(val){
       this.$store.commit('mobile/SET_JUMP',val);
      },
      stepNum(val){
        console.log(val,'vallllls');
        if(val===2){
           this.$refs.loginForm.loginConf = this.editObj.loginForm;
        }
        if(val===3&&this.portalInfo.id){
        setTimeout(()=>{
          this.$refs.design.pageList = this.editObj.pageList;
        this.$refs.design.navList = this.editObj.navList;
        this.$refs.design.drawingList = this.$refs.design.pageList[0].children[0].fields;
        this.$refs.design.activeData = this.$refs.design.drawingList[0] || this.$refs.design.navList[0]
        },0)
        }
      }
    },
    methods: {
      getRowKeys(row) {
        return row.id;
      },
      //获取表单数据
      getList() {
        let params = {
          ...this.page,
          // portalName: this.searchText,
          portalName: this.searchFormData.name, //搜索关键字
          source:"move"
        };
        getPagePortal(params)
          .then((res) => {
            if (res.code === 0) {
              this.tableData = res.data.list;
              this.pageTotal = res.data.total;
              this.tableLoading = false;
            }
          })
          .catch((e) => {
            this.tableLoading = false;
          });
      },
      //时间戳格式化
      getDateTime(time) {
        let date = new Date(time);
        let year = date.getFullYear()
        let month = date.getMonth() + 1
        let day = date.getDate()
        let hour = date.getHours()
        let minute = date.getMinutes()
        let second = date.getSeconds()
        return `${year}-${month<10?'0':''}${month}-${day<10?'0':''}${day}
          ${hour<10?'0':''}${hour}:${minute<10?'0':''}${minute}:${second<10?'0':''}${second}`
      },
      handleSelectionChange(val) {
        console.log(val)
        this.multipleSelection = val;
      },
      //发布
      publishPortal(row){
        row.isReference = 1;
       
      //  row.version = 
       editPortal(row)
            .then((res) => {
              if (res.code === 0) {
                this.$message.success("发布成功");
              this.createHistroy(row);
             this.getList();
              }
            })
            .catch((e) => console.log(e));
      },
      createHistroy(row){
       let params = JSON.parse(JSON.stringify(row));
       params.moveId = params.appid;
       params.version = Date.now();
       params.source = 'move';
       delete params.id;
       createHistroy(params).then(res=>{
        console.log(res,'sss');
       })
      },
      handleCurrentHistroy(val){
        console.log(val,'dd');
        this.curval = val;
      },
      previewHand(){
        if(!this.curval){
          this.$message.warning('请先选择版本');
          return;
        }
        this.previewPortal(this.curval);
      },
      setCurVersion(){
        if(!this.curval){
          this.$message.warning('请先选择版本');
          return;
        }
        console.log(this.curval,'ccccc1');
        let paramsVer = {
          appid:this.curval.portalNumber,
          ascription:this.curval.ascription,
          icon:'',
          id:this.histroyid,
          isReference:1,
          moveId:this.curval.portalNumber,
          portalDesc:this.curval.portalDesc,
          portalName:this.curval.portalName,
          portalJsonMessage:this.curval.portalJsonMessage,
          portalNumber:this.curval.portalNumber,
          sort:'',
          source:'move',
          superior:0,
          ascription:this.histroykehu
        };
       console.log(paramsVer,'ver');
          editPortal(paramsVer)
            .then((res) => {
              if (res.code === 0) {
                this.$message.success("设置成功");
                this.getList();
              
              }
            })
            .catch((e) => console.log(e));
      },
      closeHistroy(){
        this.curval = null;
        this.histroyPage = {
          pageNo:1,
          pageSize:10,
          total:0
        }
      },
      //编辑
      editPortal(row) {
        // console.log(row)
        this.portalInfo.id = row.id;
        this.portalNumber = row.portalNumber
        this.portalName = row.portalName
        this.ascription = row.ascription
        this.menuId = row.manageMenuId
        this.portalInfo.basic.portalNumber = row.portalNumber;
        this.portalInfo.basic.portalName = row.portalName
        this.portalInfo.basic.portalDesc = row.portalDesc    
        this.portalInfo.basic.ascription = row.ascription
        this.portalInfo.basic.version = row.version
        let jsonRender = JSON.parse(row.portalJsonMessage);
        this.editObj = jsonRender;
        this.$store.commit('mobile/SET_PAGESTORE',jsonRender.pageList);
        let arr = [];
        jsonRender.pageList.forEach((item) => {
      if (Array.isArray(item.children)) {
        item.children.forEach(val=>{
          arr.push(...val.fields);
        });
        
      }
    });
        this.showDesigner = true;
        this.isReference = row.isReference;
      },
      //预览
      previewPortal(row) {
        console.log(JSON.parse(row.portalJsonMessage))
        this.mobileConfData = JSON.parse(row.portalJsonMessage)
        this.fullScreen = false
        this.tableName = row.tableName
        this.dialogPreviewVisible = true
        setTimeout(()=>{
          this.$refs.drawItem.loginCent = true;
        },100);
        

      },
      histroySizeChange(val){
        this.histroyPage.pageSize = val;
      },
      histroyCurrentChange(val){
        this.histroyPage.pageNo = val;
      },
      //删除
      delPortal(row) {
        this.$confirm("是否确认删除", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            return delPortal({
              id: row.id
            });
          })
          .then((res) => {
            if (res.code === 0) {
              this.$message.success("删除成功");
              this.getList();
              // setTimeout(() => {
              //   window.location.reload()
              // }, 1000)
            }
          })
          .catch((e) => console.log("删除表单信息:", e));
      },
      //批量删除
      multiDelPortal() {
        this.$confirm('是否确认删除', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let ids = this.multipleSelection.map((item) => {
            return item.id
          })
          batchDelPortal(ids).then(res => {
            if (res.code === 0) {
              this.$message.success('删除成功')
              this.getList();
              // setTimeout(() => {
              //   window.location.reload()
              // }, 1000)
            } else {
              this.$message.error('所选数据删除失败！')
            }
          }).catch(e => console.log('批量删除：', e))
        })
      },
      //新增表单
      addPortal() {
        this.portalInfo.id = false
        this.showDesigner = true;
        this.$refs.design.pageList = deepClone(pageOptions);
        this.$refs.design.drawingList = this.$refs.design.pageList[0].children[0].fields;
         this.$refs.design.activeData = basicComponents[0];
        this.$refs.design.navList = [];
        this.$store.commit("mobile/SET_PAGESTORE", pageOptions);
      },
      //菜单发布
      publishMenu(data) {
        //用户提交菜单
        menuRelease(data)
          .then((res) => {
            if (res.code === 0) {
              this.menuId = res.data;
              //this.$message.success('提交菜单发布成功')
            }
          })
          .catch((e) => console.log(e));
      },
      updateMenu(data) {
        menuUpdate(data)
          .then((res) => {
            if (res.code === 0) {}
          })
          .catch((e) => console.log(e));
      },
      //门户设计完成
      finishPortal() {
        let pageOptionsCopy = [];
      this.$refs.design.pageList.forEach((item) => {
        if (Array.isArray(item.children)) {
          pageOptionsCopy.push(...item.children);
        }
      });
      let drawarr = [];
      pageOptionsCopy.forEach(item=>{
        drawarr.push(...item.fields);
      })
      if(!drawarr.length){
        this.$message.error('请添加页面组件');
        return;
      }
      let namearr = pageOptionsCopy.map(item=>{return item.name});
      if([...new Set(namearr)].length<namearr.length){
         this.$message.error('页面名称不能重复');
         return;
      }
        
        if (!this.portalInfo.id) { //新增
         
              let jsonRender = {
                pageList:this.$refs.design.pageList,
                navList:this.$refs.design.navList,
                loginForm:this.$refs.loginForm.loginConf,
              }
              let params = {
                ...this.portalInfo.basic,
                portalJsonMessage: JSON.stringify(jsonRender),
                manageMenuId: this.menuId,
                source:"move",
                isReference:0,
                appid:this.portalInfo.basic.portalNumber,
                moveId:this.portalInfo.basic.portalNumber
              };
              addPortal(params)
                .then((res) => {
                  
                  if (res.code === 0) {
                    this.handlerSuccess();
                  }else if(res.code === 500){
                   
                  }
                })
                .catch((e) => {
                  Message.closeAll();
                    addPortal(params)
                .then((restwo) => {
                  
                  if (restwo.code === 0) {
                    this.handlerSuccess();
                  }
                })
                });
           // }
         
        } else {
          let data = {
            component: "custom/mobiledesign/components/mobilePage",
            icon: this.portalInfo.basic.icon,
            name: this.portalInfo.basic.portalName,
            parentId: this.portalInfo.basic.superior,
            path: this.portalInfo.basic.superior === 0 ?
              `/portal/portalPage/${this.portalInfo.basic.portalName}/${this.portalInfo.id}/` :
              `portalPage/${this.portalInfo.id}`,
            permission: "",
            sort: 1,
            status: 0,
            type: 2,
            id: this.menuId
          };
          // this.updateMenu(data)
          let jsonRender = {
            pageList:this.$refs.design.pageList,
            navList:this.$refs.design.navList,
            loginForm:this.$refs.loginForm.loginConf,
          }
          let params = {
            ...this.portalInfo.basic,
            id: this.portalInfo.id,
            portalJsonMessage: JSON.stringify(jsonRender),
            source:"move",
            isReference:this.isReference,
            appid:this.portalInfo.basic.portalNumber,
            moveId:this.portalInfo.basic.portalNumber
          };
          editPortal(params)
            .then((res) => {
              if (res.code === 0) {
                this.$message.success("修改成功");
                this.closeDesign();
                // this.tableLoading = true;
                this.$refs.multipleTable.clearSelection();
                if(this.isReference==1){
                  this.createHistroy(params);
                }
                this.getList();
                // setTimeout(() => {
                //   window.location.reload()
                // }, 1000)
              }
            })
            .catch((e) => console.log(e));
        }
      },
      handlerSuccess(){
        this.$message.success("创建成功");
        this.closeDesign();
        this.page.pageNo = 1;
        this.searchText = "";
        this.$refs.multipleTable.clearSelection();
        this.getList();
      },
      //关闭门户设计
      closeDesign() {
        this.menuId = "";
        this.showDesigner = false;
        this.stepNum = 1;
        this.$refs.basicForm.resetFields();
        this.$refs.design.drawingList = []
        this.portalInfo.id = ''
      },
      //门户设计：下一步/上一步
      nextStep(flag) {
        if (flag === "plus") {
          this.$refs.basicForm.validate((valid) => {
            if (valid) {
              let params = {
                ...this.portalInfo.basic,
                isBase: true,
                source:"move"
              };
              let str = this.portalInfo.basic.portalNumber;
              if (this.portalInfo.id) { //修改
                if (this.portalInfo.basic.portalNumber === this.portalNumber && this.portalInfo.basic.portalName ===
                  this.portalName) {
                  this.stepNum++;
                  return true;
                } else {
                  this.stepNum++;
                      return true;
                //   getAppIdData({
                //   id:str,
                //   isReference:5
                //   }).then(res=>{
                //   if(res.code===0){
                //     if(res.data){
                //       this.$message.warning('appId已存在，请重新输入');
                      
                //     }else{
                //       this.stepNum++;
                //       return true;
                //     }
                //   }
                //  })
                  
                }
              } else {
               if(this.stepNum===1){
                getAppIdData({
                  id:str,
                  isReference:5
                  }).then(res=>{
                  if(res.code===0){
                    if(res.data){
                      this.$message.warning('appId已存在，请重新输入');
                      
                    }else{
                      this.stepNum++;
                      return true;
                    }
                  }
                 })
               }else{
                this.stepNum++;
               }
                
              }
            } else {
              return false;
            }
          });
        } else {
          this.stepNum--;
        }
      },
      //搜索
      searchChange() {
        this.searchFormData = reorganizationParam({name: this.searchText})
        this.page.pageNo = 1;
        this.tableLoading = true;
        this.getList();
      },
      //重置
      resetSearch() {
        this.searchFormData={}
        this.searchText = ''
        this.searchChange()
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
        this.page.pageNo = 1;
        this.tableLoading = true;
        this.getList();
      },
      currentChange(current) {
        this.page.pageNo = current;
        this.tableLoading = true;
        this.getList();
      },
      showHistroy(row){
        this.histroyid = row.id;
        this.histroykehu = row.ascription;
        this.gridData = [];
        this.showHistroyDialg = true;
        this.getHistroy(row);
      },
      getHistroy(row){
        getHistroy({
          pageNo:this.histroyPage.pageNo,
          pageSize:this.histroyPage.pageSize,
          source:'move',
          portalName:row.appid,
          moveId:row.appid
        }).then(res=>{
          console.log(res,'rrr');
          this.gridData = res.data.list;
        });
      }
    },
  };

</script>
<style lang="scss" scoped>
  .designer {
    .base {
      margin-right: 20%;
      margin-left: 15%;
      margin-top: 5%;

      .el-form-item {
        margin-bottom: 40px;
      }
    }

    .el-input--mini {
      width: 80px;
    }

    .designHeader {
      display: flex;
      justify-content: space-around;
      align-items: center;

      .designStep {
        display: flex;
        justify-content: center;
        width: 100%;
        margin-left: 10%;

        .designStepItem {
          width: 33.3%;
          display: flex;
          align-items: center;
          justify-content: space-around;

          .designStepLine {
            display: inline-block;
            width: calc(100% - 110px);
            height: 2px;
          }

          .designStepIndex {
            font-size: 16px;
            color: white;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            text-align: center;
            line-height: 30px;
            margin-right: 5px;
            margin-left: 5px;
            font-weight: bold;
          }

          .designStepTitle {
            font-size: 14px;
            font-weight: bold;
            width: 70px;
          }
        }
      }
    }
  }
.histroy-top{
  display:flex;
  justify-content: space-between;
  margin-bottom: 10px;
  .histroy-info{
    display:flex;
  }
}
</style>
<style lang="scss">
  .designer {
    .el-table {
      box-sizing: border-box;

      &::before {
        height: 0px;
      }
    }

    .el-table--border::after,
    .el-table--group::after {
      width: 0px;
      height: 0px;
    }

    .tableInfo {
      .el-table__cell {
        // border-bottom: 0px;
        padding: 0px;
      }
    }

    .formConfig {
      .el-form-item {
        margin-bottom: 18px;
      }

      .el-table__cell {
        // border-bottom: 0px;
        padding: 0px;
      }

      .el-table__body-wrapper {
        margin-top: 10px;
      }
    }

    // 当前行高亮颜色
    // .current-row > td {
    //   background: #b2c8df !important;
    //   // color: white;
    // }

    // 鼠标悬浮行颜色
    // tr:hover > td {
    //   background-color: #b2c8df !important;
    // }
  }

</style>
